<template>
    
</template><template>  
    <header>
        <i class="fa fa-arrow-left" @click="back"></i>
        <slot></slot>
        <img src="../assets/img/logo.png" alt="">
        <span>Vue.js</span>
    </header>
</template>
<script>
    export default{
        methods:{
            back(){
                this.$router.go(-1)
            }
        }
    }
</script>
<style scoped>
    header{
        text-align: center;
        height: 44px;
        line-height: 44px;
        background-color: #1c6132;
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        padding: 0 15px;
        color: #fff;
        z-index: 100;
    }
    header i{
        float: left;
        line-height: 44px;
        font-size: 20px;
        color: #999;
    }
    header img{
        display: inline-block;
        vertical-align: middle;
        width: 1rem;
        margin: 0 auto;
    }
    header span {
        font-size: 20px;
        display: inline-block;
        vertical-align: middle;
    }
</style>